import DragAcr from './dragAcr.js'
import DragAcr2 from './dragAcr2.js'
import DragAcr3 from './dragAcr3.js'

export default {
    dragAcr: undefined,
    dragAcr2: undefined,
    dragAcr3: undefined,
    data: {
        title: "",
        reverb: 22,
        reverb2: 30,
        reverb3: 10
    },
    onInit() {
        console.log('dragAcr  onInit:');
    },
    onReady() {
        console.log('dragAcr  onReady:');
        // this.antialias();
    },
    onShow() {
        console.log('dragAcr  onShow:');
        this.initDragAcr();
        this.initDragAcr2();
        this.initDragAcr3();
        this.handerAcr();
    }
,
    canvasTouchStart(msg) {
        //console.log('dragAcr  canvasTouchStart msg:' + msg);
        this.dragAcr2.OnMouseDown(msg);
    },
    canvasTouchMove(msg) {
        //console.log('dragAcr  OnMouseMove msg:' + msg);
        this.dragAcr2.OnMouseMove(msg);
    },
    canvasTouchEnd(msg) {
        // console.log('dragAcr  canvasTouchEnd msg:' + msg);
        this.dragAcr2.OnMouseUp(msg);
    },

    canvasTouchStart3(msg) {
        //console.log('dragAcr  canvasTouchStart msg:' + msg);
        this.dragAcr3.OnMouseDown(msg);
    },
    canvasTouchMove3(msg) {
        //console.log('dragAcr  OnMouseMove msg:' + msg);
        this.dragAcr3.OnMouseMove(msg);
    },
    canvasTouchEnd3(msg) {
        // console.log('dragAcr  canvasTouchEnd msg:' + msg);
        this.dragAcr3.OnMouseUp(msg);
    },


    initDragAcr() {
        const el = this.$refs.canvas;
        if (this.dragAcr == undefined) {
            this.dragAcr = new DragAcr({
                el: el,
                value: this.reverb,
                change: (v) => {
                    console.log(`value:${v}`)
                }
            })
        }
    },
    initDragAcr2() {
        const el = this.$refs.canvas2;
        if (this.dragAcr2 == undefined) {
            this.dragAcr2 = new DragAcr2({
                el: el,
                value: this.reverb2,
                change: (v) => {
                    console.log(`value:${v}`)
                }
            })
        }
    },
    initDragAcr3() {
        const el = this.$refs.canvas3;
        if (this.dragAcr3 == undefined) {
            this.dragAcr3 = new DragAcr3({
                el: el,
                value: this.reverb3,
                change: (v) => {
                    console.log(`value:${v}`)
                }
            })
        }
    },
    handerAcr() {
        if (this.dragAcr != undefined) {
            this.dragAcr.startAnimation();
        }
    },
    timeout() {
        var This = this;
        setInterval(function () {
          //  This.handerAcr();
        }, 100)
    }
}
